.sf-map-control-container {
  height: 30px;
  width: fit-content;
  background-color: rgba(255, 255, 255, .9);
  opacity: 1;
  overflow: hidden;
  border-radius: 6px;
  box-shadow: -2px -2px 4px 2px rgba(0, 0, 0, 0.1);
  line-height: 30px;
  color: #666;
  text-align: center;
}

.sf-map-control-container.sf-map-control-loading {
  opacity: 0.7;
}

.sf-map-control-container.sf-map-control-container-mobile {
  height: 25px;
  line-height: 25px;
  opacity: .75;
}

.sf-map-control-container .sf-map-control-divider {
  height: 100%;
  width: 1px;
  position: relative;
  background-color: inherit;
}

.sf-map-control-container .sf-map-control-divider::before {
  content: '';
  position: absolute;
  top: 4px;
  height: 22px;
  width: 1px;
  background-color: #ccc;
}

.sf-map-control-container.sf-map-geolocation-control-container {
  right: 30px !important;
  bottom: 30px !important;
}

.sf-map-control-container .sf-map-geolocation-control {
  width: 30px;
  line-height: 30px;
}

.sf-map-control-container.sf-map-zoom-control-container {
  right: 66px !important;
  bottom: 30px !important;
}

.sf-map-control-container .sf-map-zoom-control {
  width: 40px;
}

.sf-map-control-container.sf-map-control-container-mobile .sf-map-control {
  height: 25px;
  width: 25px;
  opacity: .75;
}

.sf-map-control-container .sf-map-control .sf-map-control-icon {
  font-size: 14px;
}

.sf-map-control-container .sf-map-control:not(.disabled):hover {
  cursor: pointer;
  color: var(--bs-body-color);
}

.sf-map-control-container .sf-map-control.disabled {
  color: #ccc;
}

@media (max-width: 768px) {
  .sf-map-control-container.sf-map-geolocation-control-container {
    bottom: 90px !important;
  }
  .sf-map-control-container.sf-map-zoom-control-container {
    bottom: 90px !important;
  }
}
